<template>
	<view class="body">
		<view class="header">
			<view class="text1" v-bind:class="{ text2: isActive }" @click="xuanzheone">
				<view>当前状态</view>
			</view>
			<view class="text1" v-bind:class="{ text3: isActive1 }">
				<view>巡检记录</view>
			</view>
		</view>
		<view class="heand">
			<image class="imgsize" src="../../static/img/riqi.png" mode=""></image>
			<text class="riqitext">请选择日期</text>
			<image class="qiantou" src="../../static/img/more.png" mode=""></image>
		</view>
		<navigator url="../status/status" class="content">
			<view class="sample">配电箱001
			   <view class="tubiao5" style="margin-left: 57%;"></view>
			   <view class="fault">故障</view>
			</view>
			<view class="people">
				<view class="name">巡检人：<p>苏师傅</p></view>
				<view class="data">2019-03-01</view>
			</view>
		</navigator>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isActive1:true
			};
		},
		methods:{
			xuanzheone () {
				uni.navigateTo({
					url:'/pages/xiangqing/xiangqing'
				})
			}
		},
		onLoad () {
		}
	}
</script>

<style>
	.header {
		width: 60%;
		border-radius: 10upx;
		display: flex;
		background-color: #FFFFFF;
		margin-left: 148upx;
		margin-top: 30upx;
	}
	.heandtext {
		width: 50%;
		text-align: center;
		padding: 10upx;
		color: #3C6DD2;
	}
	.color {
		color: #00B26A;
	}
	.text1 {
		width: 50%;
		text-align: center;
		padding: 10upx;
		color: #3C6DD2;
	}
	.text2 {
		width: 50%;
		text-align: center;
		padding: 10upx;
		color: #FFFFFF;
		background-color: #3C6DD2;
		border-radius: 10upx 0upx 0upx 10upx;
	}
	.text3 {
		width: 50%;
		text-align: center;
		padding: 10upx;
		color: #FFFFFF;
		background-color: #3C6DD2;
		border-radius: 0upx 10upx 10upx 0upx;
	}
	.sample {
		color: #333333;
		font-size: 32upx;
		display: flex;
		padding: 23upx;
		border-bottom: 2upx solid #CCCCCC;
	}
	.people {
		display: flex;
		font-size: 32upx;
		justify-content: space-between;
		padding: 23upx;
	}
	.name {
		color: #999999;
		display: flex;
	}
	.name p {
		color: #333333;
	}
	.data {
		color: #333333;
		font-size: 32upx;
	}
	.heand {
		width: 100%;
		display: flex;
		align-items: center;
		margin-top: 30upx;
		margin-left: 3%;
	}
	.imgsize {
		width: 40upx;
		height: 40upx;
		border-radius: 10upx;
	}
	.riqitext {
		font-size: 30upx;
		color: #333333;
		margin-left: 20upx;
	}
	.qiantou {
		width: 18upx;
		height: 25upx;
		margin-left: 64%;
	}
</style>
